<template>
  <div class="app-container">
    <el-card class="box-card">
      <div slot="header" class="clearfix">
        <el-page-header @back="close" content="详情"> </el-page-header>
      </div>
      <!-- <el-avatar :size="50" src="../../../assets/common/head_img1.png"></el-avatar> -->
      <div class="info-wrap" v-if="info">
        <!-- <img
          :src="
            require(`../../../assets/common/head_img${info.patientSex}.png`)
          "
          alt=""
          class="headImg"
        /> -->
        <el-descriptions title="" :column="3">
          <el-descriptions-item label="患者姓名">{{
            info.patnName
          }}</el-descriptions-item>
          <el-descriptions-item label="年龄">{{
            info.patnAge
          }}</el-descriptions-item>
          <el-descriptions-item label="证件号码">{{
            info.certno
          }}</el-descriptions-item>
          <el-descriptions-item label="机构名称">{{
            info.fixmedinsName
          }}</el-descriptions-item>
          <el-descriptions-item label="机构编号">{{
            info.fixmedinsCode
          }}</el-descriptions-item>
          <el-descriptions-item label="医保就诊ID">{{
            info.mdtrtId
          }}</el-descriptions-item>
          <el-descriptions-item label="门诊/住院号">{{
            info.iptOtpNo
          }}</el-descriptions-item>
          <el-descriptions-item label="就诊类型"
            ><dict-tag
              :options="dict.type.yy_visit_type"
              :value="info.otpIptFlag"
          /></el-descriptions-item>
          <el-descriptions-item label="医保人员编号">{{
            info.psnNo
          }}</el-descriptions-item>
          <el-descriptions-item label="科室">{{
            info.prscDeptName
          }}</el-descriptions-item>
          <el-descriptions-item label="科室编号">{{
            info.prscDeptCode
          }}</el-descriptions-item>
          <el-descriptions-item label="医保医师代码">{{
            info.drCode
          }}</el-descriptions-item>
          <el-descriptions-item label="医师姓名">{{
            info.prscDrName
          }}</el-descriptions-item>
          <el-descriptions-item label="医师证件号码">{{
            info.prscDrCertno
          }}</el-descriptions-item>
          <el-descriptions-item label="医生职称">{{
            info.drProfttlName
          }}</el-descriptions-item>
          <el-descriptions-item label="科室名称">{{
            info.drDeptName
          }}</el-descriptions-item>
          <el-descriptions-item label="诊断">{{
            info.maindiagName
          }}</el-descriptions-item>
          <el-descriptions-item label="病情描述">{{
            info.diseCondDscr
          }}</el-descriptions-item>
          <el-descriptions-item label="审方药师科室编号">{{
            info.pharDeptCode
          }}</el-descriptions-item>
          <el-descriptions-item label="审方药师科室名称">{{
            info.pharDeptName
          }}</el-descriptions-item>
          <el-descriptions-item label="审方药师职称名称">{{
            info.pharProfttlName
          }}</el-descriptions-item>
          <el-descriptions-item label="审方药师职称编码">{{
            info.pharProfttlCodg
          }}</el-descriptions-item>
          <el-descriptions-item label="医保药师代码">{{
            info.pharCode
          }}</el-descriptions-item>
          <el-descriptions-item label="审方药师姓名">{{
            info.pharName
          }}</el-descriptions-item>
          <el-descriptions-item label="药师审方时间">{{
            info.pharChkTime
          }}</el-descriptions-item>
          <el-descriptions-item label="审方药师证件类型">{{
            info.pharCertType
          }}</el-descriptions-item>
          <el-descriptions-item label="审方药师证件号码">{{
            info.pharCertno
          }}</el-descriptions-item>
          <el-descriptions-item label="医保处方状态">{{
            info.rxStasName
          }}</el-descriptions-item>
          <el-descriptions-item label="医保费用类别名称">{{
            info.hiFeesetlName
          }}</el-descriptions-item>
          <el-descriptions-item label="医保处方编号">{{
            info.hiRxno
          }}</el-descriptions-item>
          <el-descriptions-item label="撤销医师代码">{{
            info.undoCode
          }}</el-descriptions-item>
          <el-descriptions-item label="撤销医师姓名">{{
            info.undoDrName
          }}</el-descriptions-item>
          <el-descriptions-item label="撤销医师证件号码">{{
            info.undoDrCertno
          }}</el-descriptions-item>
          <el-descriptions-item label="撤销原因描述">{{
            info.undoRea
          }}</el-descriptions-item>
          <el-descriptions-item label="撤销时间">{{
            info.undoTime
          }}</el-descriptions-item>
          <!-- <el-descriptions-item label="挂号费">{{
            info.rgstFee
          }}</el-descriptions-item>
          <el-descriptions-item label="总额">{{
            info.medfeeSumamt
          }}</el-descriptions-item> -->
          <el-descriptions-item label="审核状态">
            <dict-tag
              :options="dict.type.yy_push_status"
              :value="info.status"
            />
          </el-descriptions-item>
          <el-descriptions-item label="省医保药品库存是否满足原因">{{
            info.remarks
          }}</el-descriptions-item>
          <el-descriptions-item label="就诊时间">{{
            info.mdtrtTime
          }}</el-descriptions-item> 
          <el-descriptions-item label="处方笺" v-if="info.status != 5">
            <el-button
              size="mini"
              type="primary"
              icon="el-icon-document"
              @click="openPDF(info.sigUrl)"
              v-hasPermi="['pr:consultation:edit']"
              >点击查看</el-button
            >
          </el-descriptions-item>
        </el-descriptions>
      </div>
      <!-- <el-divider></el-divider> -->
      <el-tabs
        v-model="activeName"
        type="card"
        @tab-click="handleClick"
        style="height: 100%"
      >
        <el-tab-pane label="诊断信息" name="first"
          ><diagnosticMessage :id="id"></diagnosticMessage
        ></el-tab-pane>
        <el-tab-pane label="处方信息" name="second"
          ><prescription :id="id"></prescription
        ></el-tab-pane>
        <el-tab-pane label="审核订单" name="thirdly"
          ><pushOrder :id="id"></pushOrder
        ></el-tab-pane>
      </el-tabs>
    </el-card>
  </div>
</template>

<script>
import { getConsultation } from "@/api/pr/consultation";
import prescription from "./prescription.vue";
import diagnosticMessage from "./diagnosticMessage.vue";
import pushOrder from "./pushOrder.vue";

export default {
  dicts: ["yy_visit_type", "yy_push_status"],
  components: {
    prescription,
    diagnosticMessage,
    pushOrder,
  },
  data() {
    return {
      // 假设有初始数据
      info: null,
      paymentOrderRecordList: [],
      outpatientNo: "",
      id: "",
      activeName: "first",
    };
  },
  created() {
    this.id = this.$route.params && this.$route.params.id;
    this.getDetail();
  },
  methods: {
    openPDF(base64String, filename) {
      const url = "data:application/pdf;base64," + base64String;
      const newWindow = window.open();
      newWindow.document.write(
        '<iframe width="100%" height="100%" src="' + url + '"></iframe>'
      );
    },
    handleClick(tab, event) {
      console.log(tab, event);
    },
    /** 修改按钮操作 */
    getDetail() {
      getConsultation(this.id).then((response) => {
        this.info = response.data;
      });
    },
    /** 查询云HIS-支付记录列表 */
    getList() {
      this.loading = true;
      listPaymentOrder({ outpatientNo: this.info.outpatientNo }).then(
        (response) => {
          this.paymentOrderRecordList = response.rows;
        }
      );
    },
    /** 关闭按钮 */
    close() {
      const obj = {
        path: "/pr/consultation",
        query: { t: Date.now(), pageNum: this.$route.query.pageNum },
      };
      this.$tab.closeOpenPage(obj);
    },
  },
};
</script>

<style scoped lang="scss">
.info-wrap {
  display: flex;
  margin-bottom: 28px;
  .headImg {
    margin-right: 28px;
    display: block;
    width: 50px;
    height: 50px;
  }
}
.box-card {
  min-height: calc(100vh - 136px);
}
.amount-wrap {
  margin-top: 24px;
  .amount {
    font-weight: bold;
    display: flex;
    align-self: center;
    justify-content: flex-end;
    .num {
      color: #f72d38;
      min-width: 100px;
      text-align: right;
    }
  }
}
</style>
